Hace unos días veíamos una forma de dar utilidad al footer, le añadíamos opción para añadir gadgets y a modo decorativo una imagen de fondo. Adelantaba que si la idea era añadir varios gadgets lo mejor era crear divisiones de forma que el contenido quedara ordenado.


Para empezar lo que haremos será añadir las siguientes líneas de código justo antes de ]]></b:skin>

#footer-columna-contenedor {
clear:both;
}
.footer-columna {
padding: 10px;
}

Luego dejaremos el footer libre de gadgets si es que los tenemos, podemos hacer dos cosas arrastrarlos a la sidebar provisionalmente o copiar las líneas de código pertenecientes a cada gadget y pegarlas en el bloc de notas para más tarde volver a añadirlos.


Las líneas de código empiezan todas con b:widget más o menos así:

<b:widget id='BlogArchive1' locked='false' title='Archivo del blog' type='BlogArchive'/>

Una vez dejamos el footer libre buscamos al final de la plantilla lo siguiente:

<div id='footer-wrapper'>
<b:section class='footer' id='footer' showaddelement='yes'/>
</div>

De no tener la opción de añadir gadgets sería algo así:

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

En ambos casos lo que haremos será sustituir la línea en negrita por lo siguiente:

<div id='footer-columna-contenedor'>

<div id='footer-izquierdo' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>

<div id='footer-centro' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>

<div id='footer-derecho' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>

<div style='clear:both;'/>

<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: none;'>

<b:section class='footer' id='col-bottom' preferred='yes'/>

</div>

<div style='clear:both;'/>

</div>

Miramos en vista previa para ver si es posible guardar los cambios y si es así guardamos.
En plantilla de diseño lo veremos de esta forma.


Ahora vamos a personalizar ese nuevo espacio.
Vamos otra vez justo antes de ]]></b:skin> y añadimos lo siguiente:

#col1{
background:#000;
margin: 5px;
padding: 5px;
border: 1px solid #fff;
}
#col1 h2{
background:#000;
margin: 0.0em 0 .5em;
padding: 4px 3px;
text-align: center;
font-size: 90%;
color:#fff;
}
#col2{
background:#000;
margin: 5px;
padding: 5px;
border: 1px solid #fff;
}
#col2 h2{
background:#000;
margin: 0.0em 0 .5em;
padding: 4px 3px;
text-align: center;
font-size: 90%;
color:#fff;
}
#col3{
background:#000;
margin: 5px;
padding: 5px;
border: 1px solid #fff;
}
#col3 h2{
background:#000;
margin: 0.0em 0 .5em;
padding: 4px 3px;
text-align: center;
font-size: 90%;
color:#fff;
}

Nos familiarizamos con los estilos intentando conocer a qué parte corresponde cada uno para poder personalizarlos.

Contenido
footer izquierdo col1
footer centro col2
footer derecho col3

Títulos
footer izquierdo col1 h2
footer centro col2 h2
footer derecho col3 h2

Con background estamos añadiendo color de fondo, en border añadimos estilos al borde y utilizamos color para el color del texto.

Guardamos los cambios y en plantilla de diseño añadimos esos gadgets que tenemos en espera o los que pensamos añadir.El resultado sería algo así.

Un poco triste y aburrido ¿verdad? vamos a darle un poco de vidilla pero primero le daremos color a ese fondo, buscamos las primeras líneas que añadimos y le damos color.

#footer-columna-contenedor {
background:#000;
clear:both;
}

Podemos eliminar el color de fondo y borde de los gadgets y añadir una imagen en su lugar.

#footer-columna-contenedor {
background-image:url('url-de-tu-imagen');
clear:both;
}

Se puede seguir jugando...






Más ejemplos de footer sencillos de crear.


Michael Norambuena

Lejos una de las mejores entradas que haz publicado gem@ :D!!!, y eso que te sigo desde hace ya años !!! vamos a probar mañana que tal resulta todo esto ;)

Gem@

yz Hola Michael!! que cierto es eso que dices eres una de las primeras visitas que recibí y dejó su comentario.
Que bueno que no te hayas aburrido y aún me sigas. GRACIAS :)

Unknown

:P qué bello automóvil tienen Barbie :P...buenísimo ahora a trabajar y jugar...besitos!!!

Unknown

tienes :D

Marga

Ay Gema, como me gusta aprender jejeje
Acabo de probarlo en un blog de pruebas y me ha salido a la primera. Que lástima que ahora no puedo seguir pero la próxima semana lo intentaré en el blog bueno, espero no tener problemas porque ya sabes que la plantilla es algo distinta....
Lo explicaste a la perfección :D

Gem@

yz Hola Graciela pues a jugar de ha dicho :)

yz Marga es cierto que la plantilla es distinta por eso antes de hacerlo en el blog bueno descarga tu plantilla y la añades al blog de pruebas. De esa forma ves como resultarían los cambios pero en la misma plantilla que utilizas (Me encantó la colección de botijos :) )

Marga

Jejeje Gema no he podido resistirme y ya lo probé y ....
perfecto. Ya lo próximo será jugar con las lineas, títulos, colores, etc.
Que tengas un buen fin de semana.
Un beso
Marga

Admin

Muy bueno gem@!, ya lo hice, me salió bastante bien creo :o ja ja
Habría que ver como separar, si es que se puede, un gadget de otro, si, creo que se puede, lo he visto por ahí pero no se como :O
También me gustaría darle la forma redondeada que tengo en la sidebar, para que no quede tan cuadrado no?
El tema de que las visitas no lleguen al footer lo veo mas optimista ahora, ya que al sacar gadgets de la sidebar esta se hace mas corta y también se puede reducir el número de entradas a mostrar, por lo tanto ya no está tan lejos el footer como antes, como lo ves?
Cuando quieras date una pasadita a ver si te gusta como me quedó, ahh en Te Propongo lo hice por ahora.
Besotes y muchas gracias ;)

Admin

Otro detallecito gem@, no se como centrar algunos de los gadget, ejemplo, Directorios, que es un expand-colapsed, el archivo y el suscribirse a los comentarios de Blogger, me queda a la izquierda de la pantalla, cuando todo lo demás se centra solo o con ayuda pero se centran, estos que te digo no :(

Gem@

yz Marga... que esto engancha te aviso :)
Buen fin de semana para ti también, un besote :)

yz k_nelita ya lo creo que te salió bien, para centrar los directorios no hay fórmula porque si los centras quedarán uno después de otro hay que añadirle estilos a esos botones o incluirlos dentro de una tabla.
Otra idea es añadirlos abajo del todo dentro de un gadget para que queden de forma alineada, Rosa los tienes así y quedan muy ordenados.
Los míos me llevan de cabeza y después de mucho repasar resulta que algunos no conservaban la página que en su momento me registré así que fui eliminado hasta quedarme con lo que hay y son muchos.
Más cosas...la imagen de los directorios la puedes centrar con el clásico <center> y </center> de esta forma:
<a href="javascript:void(0);" onclick="expandcollapse('Directorios')"><center><img src="http://3.bp.blogspot.com/_8UTObT16lLc/SPv18OVhesI/AAAAAAAABIs/kbLqv6AlIaQ/S1600-R/directorios.JPG"/></center></a>

Los archivos añade antes de ]]></b:skin> lo siguiente:
#BlogArchive1{
margin-left: 45px;
}

Para el suscribirse:
#Subscribe1{
margin-left: 45px;
}

Ya me dices que tal queda ;)

Admin

Genia gem@ como siempre!! Me quedó muy bien, lo del center era para la imagen del botón, lo había hecho así pero no me lo tomaba seguro que puse alguno de los center donde no debía :D
Los botones de los Directorios hace rato que dejé de preocuparme por como quedaran, no hay modo de que se alinien como quiero ja ja, lo que quería era eso el botón que dice Directorios, ya lo logré gracias a vos.
Y los archivos y suscribirse quedó mucho mejor pero tal vez debería cambiar el 45 por algún valor algo mayor porque no quedan totalmente en el centro, pero se acercan mucho mas.
Mil gracias, ahora no tengo mas tiempo, después veré de corregir eso, me alegra que te gustara :D
Besotes miiil ;)

Gem@

yz k_nelita el 45 lo puedes ir variando hasta centrarlo completamente, me alegra que estés contenta :)
BESOTES !!!

Mamots

Hola, un par de cosillas, como poner los emoticonos y saber si es normal que falle tanto la lista de blog, porque tengo que star reponiendola muy asiduamente.

Gracias

G

Hola Gem@
Primera vez que visito tu blog y me ha gustado.

Bien, yo acabo de crear mi blog hace tan sólo unas horas atrás y no sé mucho sobre los blogs (sus partes,etc).
Así que no entiendo muy bien lo que es el Footer (perdona mi ignorancia).
Que parte del blog es?

Es donde, por ejemplo, Jéssica tiene sus links de datos e información ,o como el de Rosa donde tiene los links de top comentaristas y seguidores?

Saludos y perdona por las molestias, pero como te expliqué soy nueva en esto :)

Gem@

yz Mamots te refieres a los emoticonos en los comentarios o todo el blog ?

yz Así es G,al principio de la entrada hay un enlace que nos lleva a otra donde puedes ver en una imagen en sitio exacto del footer, pero estás en lo cierto es justamente donde me has indicado :) Y no hay nada que perdonar...

Doktor Gnómegang

¡Genial! Me ha quedado de maravilla, gracias a tí.

¿Como podría agradecerte?

Un gran abrazo!

Raúl

hola que tal gem@ quisiera preguntarte como hago para que google no indexe mis entradas???

Gem@

yz Dr. Gnómegang me alegra que resultara bien, estuve mirando esos cambios y están genial, voy a verlo todo con más detalle :)
¿Agradecerme? ya lo estás haciendo con esa alegría que se muestra tu comentario. Otro abrazo para ti amigo :)

yz Raúl en Configuración | Básico ...

¿Deseas añadir tu blog a nuestras listas? NO¿Deseas permitir que los motores de búsqueda encuentren tu blog? NO ;)

Y si te diste de alta en Google también puedes anularla :(

Raúl

jejeje muchisimoas gracias gem@ una última preguntita si me di de alta en google como hago para anularla a donde debo ir GRACIAS :)

Humberto

Muchas gracias, voy a probarlo.

Gem@

yz Raúl mira aquí:
http://www.google.com/intl/es/remove.html

yz Suerte Humberto ;)

Marga

Bueno Gema, ya se pasó el finde y aquí estoy de nuevo.

Estoy practicando con los bordes, los colores etc. etc. pero me gustaría que me dijeras una cosita que seguro es muy sencilla, pero ...
Quería poner varias imágenes en un gadget del footer, pero que me queden colocadas horizontalmente, no se si me explico ?? Seguro que me entiendes jejeje
Por ejemplo, las tres que tengo en "mis otros blogs".

Un beso,
marga

Gem@

yz Veamos ahora es la tercera vez que lo escribo... hoy está loco el formulario.
Decía que en un gadget de HTML añades lo siguiente:
<a href="url-de-la-página"><img src="url-de-la-imagen"/></a>&#32;<a href="url-de-la-página">
<img src="url-de-la-imagen"/></a>
Eso que ves ---> es lo que hace la separación entre una imagen y otra para que no queden pegados los lados, las añades una seguida de otra para que queden en la misma línea ;)

Gem@

Donde digo en el anterior comentario "Eso que ves --->" me refería a esto &#32; ;)

Marga

Buenos días Gema.

A la primera !!!!! (Pero el mérito es tuyo jejeje)

Besos,
Marga

fernando reyes baños

Muchas gracias Gema por tu post! Gracias a él pude "enchular" el footer de mi blog (si pasas a verlo sería todo un honor :)). ¡Saludos!

Gem@

yz Me alegra mucho Marga :)

yz R.Baños gracias a ti por comentar, veamos esa obra de arte ;)

Gem@

yz R.Baños buen trabajo!!! lindo, útil y elegante ;)

Nathan yo

Milllllllllllllll gracias Gem@ eres una piedra preciosa, ja,ja no podía hacer esto para el blog de mi iglesia pero gracias a ti o a usted como te/le guste pude:D

Nathan yo

Hola, Gema quería saber como aumentar el tamaño del post en mi blog no funciona con solo aumentar el tamaño de body, solo la pagina aumenta pero el post no

Gem@

yz Global Metion Blog lo de usted lo dejamos para dentro de unos años :)

Sobre aumentar el tamaño de los post es necesario hacerlo en main-wrapper pero.....
No se puede aumentar así como así, porque quedará todo "descolocado" para aumentar de un sitio hay que restar ese mismo valor de otro, y ese otro es la sidebar.
Imagina que deseas guardar una cosa en un armario donde no hay laterales, y ya está todo ordenado y acoplado a la medida. Si intentas guardar algo de más anchura lo más probable es que al ser más ancho empuje lo que hay a los lados ¿qué ocurre? que lo que hay a los lados se caerá.
Con en blog es algo parecido, si intentas ensanchar los post la sidebar se caerá, se desplazará hacia el fondo del blog.

Si la sidebar en amplia puede que no tengas problema en quitarle un poco de anchura, pero mira en vista previa para evitar disgustos ;)

Nathan yo

OK Gema jaja no te procupes

Gem@

yz Creo que te quité las ganas de hacer eL cambio :O

Maite

Hola Gema... pero si no me había dado cuenta de tu footer!!!! no tengo perdon! HA QUEDADO GENIAL! ME ENCANTA !!!!!!!! -y gracias por lo que me toca :) ...
Y yo que hasta ahora no le daba importancia al faldón... estoy pensando en mi blog privado, sabes que es texto y texto y texto y blablablabla... y al mes me interesa sacar las entradas de esos días e imprimirlas, así que sigo pensando que cuanto más ancho sea el blog mejor, a modo de folio tal cual, y poner los gadgets que son pocos abajo.
Se te ocurre que pueda encontrarme con alguna pega al dejar todo abajo y el ancho del blog entero para las entradas?
(hay madre como me enrollo... :D )

me encanta como te ha quedado todo el diseño del blog! besazo!

Gem@

yz Maite puede darse más anchura al main eliminando la parte de sidebar y dejar solamente el footer para los gadgets.
Seguramente no viste este blog de ejemplos:

http://gemasblogss.blogspot.com/

(ahora dime que te he copiado la idea) jajajaja

Maite

jijiji ay madre... JUSTO!!! que me has copiado no, más bien seguro que te lo ví y aunque no pensé utilizarlo en su momento, me debió venir a la cabeza cuando ví esta entrada :D
genial, ya me veo metiendo mano a los códigos en breve !!!!! que miedo me doy jajaja

besazo ! (ya vamos más de 1000!!!!)

Gem@

yz Pasamos las 1000 Maite!!
Lo de copiar era con segundas para picarte, no hacía falta tanta explicación :)

Maite

No me hables, que cuando le dí a "enviar" ya pensé en la chapa innecesaria que te había metido jajaja total, pa´ná :D
Besazo

Gem@

yz jajajaja no te preocupes ya estoy acostumbrada :)

Siervo

Otra vez Gema, recurriendo a tu ingenio y conocimientos, deseo consultarte.
Mira ya hice todos los pasos, y todo quedo ok, es decir guarde cambio y me lo acepto, pero cuando ilusionado yo fui haber en elementos de pagina, sorpresa, sopresa no habia nada, que trauma senti al sentir desaparecer mis ideas que estaban destinado para ese sitio (footer) please ayudame, creo que hay un codigo que esta alli siempre y no sale, algo asi como la direccion del blog de donde baje la plantilla, por favor espero su ayuda y ojala no escuche cambia de plantilla, gracias..

Gem@

yz Siento la demora Siervo pero no había visto este comentario, veo que ya lo solucionaste :)

Siervo

Si Gema creo que pude obtener un poco de tu habilidad para estsa cosas, pero por ahi te caigo con otra consulta.

Maite

Estoy con los primeros pasos ;) luego experimentaré a poner imagen de fondo y esas cosas... pero he visto de K_nelita te preguntaba cómo separar los gadgets y no me ha quedado claro, se me quedan muy pegaditos y chochos :$ he probado a poner diferentes valores en pading pero no hace nada.
Dónde podemos darle separación? gracias majetona, espero hacer algo chulo y enseñártelo :)

Gem@

yz Veremos esa otra consulta Siervo :D

yz Maite los estilos que puse de ejemplo son los que yo tengo, pero según el ancho de la plantilla así queda ¿lo tienes en un blog público que lo vea?

Maite

Te mando invitación al blog... mmm pero ponte las gafas de sol jajaja que luego no quiero represalias!!!
Quiero separar los gadgets no en horizontal sino en vertical. El otro problemilla es que con el explorer el gadget de la izquierda del footer se pega a los bordes de la hoja, pero el en fire se ve genial.
Ya se queda como está, no quiero recargalo más... pero sí me apetecería arreglar esas cosillas.
Sobre la cabecera, no te preocupes, me quedo sin el título pero no pasa nada. Besazo y gracias :D

Gem@

yz Recibido y contestado Maite :)

-Me puse las gafas pero no as de sol porque valía la pena ver algo tan lindo :)

Everth21 xD!!

muchas gracias, voy a probarlo en mi blog www.zonazoft.com! eternamente agradecido.

Gem@

yz Suerte Everth21 xD!! :)

Gabuleta*

Hola Gema! Disculpá que te escriba en un post viejo pero tengo un problema con esto. Hice todo lo que decís y salió bien, pero los widgets no quedan sobre la imagen del footer. SI ves mi lista de blogs, el que estoy modificando es "otra histérica del montòn." EN el footer puse esa imagen, y ahora agrego los wisgets y salen sobre la parte blanca, no la decorada. Por que sucede esto?
Miles de gracias.

Gem@

yz Saludos Gabuleta no hay que disculpar nada, haces bien en comentar en la entrada que trata sobre tu pregunta :D
En tu plantilla veo que añadiste la imagen del footer siguiendo las indicaciones para añadir una imagen fija y es un pequeño error porque es la forma para añadir una imagen a un footer sin columnas y que la imagen quede estática. Deberías seguir los pasos de esta entrada y añadir la imagen como se indica en:

#footer-columna-contenedor {
background-image:url('url-de-tu-imagen');
clear:both;
}

Tienes mucho gusto con el diseño ;)

Gabuleta*

Miles de gracias Gema! Ahora mismo lo pruebo! Gracias por lo del gusto en el diseño, de hecho el blog es para poner trabajos de diseño gráfico.
Saludos, ya te cuento como me fue:D

Gem@

yz No hay de qué Gabuleta, cuando lo termines das un toque y lo vemos :)

Gabuleta*

Vuelvo con el resultado! Lo pude hacer pero tengo una consulta:
No hay forma de que el tamaño del footer me quede fijo? Porque se va expandiendo para abajo a medida que agrego widgets. Por ejemplo puse el logo de Blogger y para que se viera toda la imagen del footer, agregué dos widget de imagen con 100px x 100px vacíos para rellenar y que se expanda, no se si me explico. El tema es que me gustaría que quede fijo, como lo tenía antes.

Espero que se haya entendido mi duda.
Quedó mas chica la imagen, ya veré como lo soluciono, pero por lo menos puedo poner los widgets!

Si me resolvés esa duda ya estaría listo, muchas gracias!

Gabuleta*

Gabuleta*

Escribí otro comentario y se borró :D Quería preguntarte si vos usás IE o Mozilla porque en este último se me ve re mal el blog, como que la sidebar estuviera ancha, y se baja. Pero en IE está bien el tamaño!

Gem@

yz Hola Gabuleta, ese problema de ir alargando el footer es lógico pero hay un remedio y es incluir los gadgets en un scroll, mira más o menos lo que sería:
http://gemablog-.blogspot.com/2008/11/aadir-scroll-en-los-gadges-elementos-de.html

Suelo usar Firefox como navegador y comprobar el resultado con Explorer (lo contrario que tú)
Estuve repasando el código fuente de tu blog y por ejemplo podías probar lo siguiente.
Busca #outer-wrapper y donde pones padding:0px 10px; déjalo sólo en padding: 10px;
Por lo que veo la plantilla que usas es la Minima de Blogger (todo un acierto) :)

Kirei

Hola Gema hice la prueba con el footer y salió pero tengo una consulta: se puede repetir la imagen para que ocupe todo el espacio? probé con colocar en el ancho 100% y repeat-x pero no funciona.Podes darte una vuelta por el blog cuando tengas tiempo? Gracias desde ya. Es el blog kireidesign_pruebas.Saludos...

No te austes porque estuve toqueteando la plantilla y no se demasiado, así que es posible que algo esté incorrecto.

Gem@

yz Suprime REPEAT-X Kirei y se repetírá en todo el espacio.
Está quedando lindo de verdad tu sitio ¡me encanta!!

Kirei

Hola Gema soy yo de nuevo con el tema del footer (que quiero que se repita a lo largo de la página) borré repeat-x y sigue igual, en donde dice #footer hay una imagen que había puesto antes de colocar las columnas, esa imagen no se ve más y si se ve la nueva imagen que puse en la parte de #footer-columna-contenedor; pero no logro que se repita, hay algo que está funcionando mal y no lo encuentro...
Muchas gracias por tu ayuda, logre esto gracias a aportes como el tuyo que realmente sirven muchisimo ya que recien en diciembre me meti en esto del blog y no tenía idea de nada... Espero ser una buena alumna y lograr diseñar algo que quede bien.
(quizás la solución sea poner el header del mismo ancho que el footer, pero me gustaba la idea de que se repita) De todas maneras voy a seguir probando ya que faltan muchas cosas. Un abrazo.

Gem@

yz Kieri tienes una imagen añadida en el contenedor, esa imagen está ocupando todo el ancho porque la medida del footer no está establecida. Si añades width:100% le estás diciendo que ocupe todo el ancho de ese espacio y eso es lo que hace.
Prueba a suprimir la imagen que añadiste anteriormente en #footer y añade ahí mismo width:700px;

Con 700 le estaremos dando el ancho del header, si deseas que la imagen ocupe más a lo ancho hay que darle más anchura en lugar de 700 prueba con width: 720px eso sería la medida de outer-wrapper que es el espacio total del blog.

Kirei

Gracias Gem@ por tu respuesta, voy a intentarlo.

Gem@

yz Gracias a ti Kieri ;)

FrAnKo

ola k tal gema eh kerido poner a mi editar mi plantilla de mi blogger para poder tener columna sen footer pero no puedo al hacer todo como dice el ejemplo k dejastes me sale esto por k?
No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.
Mensaje de error de XML: The element type "b:section" must be terminated by the matching end-tag "".

FrAnKo

eh seguido intendado y ahora me sale
No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.
Mensaje de error de XML: The element type "div" must be terminated by the matching end-tag "
ayuda please mi msn es play21_88@hotmail.com

Gem@

yz FrAnko repasa el código porque el error dice que falta un </div>

egoloco

Gema, gemita, gema... la gente te adora por las maravillas que haces, y espero que puedas ayudarme un poquitin... me gustaría saber cómo hacer para tener un footer al estilo Rosa, es decir de ancho "total". Tu hack es bueno, pero aunq lo pruebe no queda como lo quiero. Alguna sugerencia??

Gem@

yz egoloco la sugerencia es añadir al fondo del blog el mismo color que al footer y uno distinto a las entradas eso produce un efecto de ancho total.

Anónimo

excelente post me arroste cambiar mi plantilla xd

Andres

Hola Gem@ que tal?
Es la primera vez que entro a tu blog y vi lo del footer y ya me lo puse a hacer!
(Si queres mirar entra aca: www.agromaquinaszunini.blogspot.com)
Quisiera saber si habria una forma de hacer algo parecido pero abajo de la cabecera del blog, una especie de menu, pero para poner la fecha, el estado del tiempo, etc.
Te agradezco por la ayuda del footer!
Saludos!

Unknown

ahora vengo por aquí. esto es lo que hice, antes de intentar poner color. fíjate que las columnas no tienen el mismo el ancho. ¿es correcto? además me desapareció la opción de poner un widget largo debajo de los otros widgets.había algo ahí que ya no recuerdo lo que era...ay de mí.

Gem@

yz Gracias a ti por comentar Fer1450 ;)

yz Andres hice una entrada hace tiempo puedes verla ¿te refieres a esto o con tres bloques para contenido?
http://gemablog-.blogspot.com/2009/02/personalizar-el-crosscol.html

yz lk si añades algún contenido se verá mejor eso que dices así sin nada no puede verse.
(Añade color de fondo a las columnas te ayudará a guiarte)

Andres

Hola Gem@, gracias por contestar!
Mi idea era que queden tre bloques para contenido. No se si seria posible.
Igual si no se puede no pasa nada, no es de máxima urgencia.
Ya que estoy aprovecho para hacerte otra pregunta: ¿Viste el blog de Filigrana, el blog de la semana? Bueno, ¿Cómo se hace como ella para poner desde la cabecera hasta donde termina el footer en blanco?
Es bien parecido al tuyo.

Muchas gracias por la atención, ya tenes otro fan!

Gem@

yz Hola Andrés esta es la entrada que hice sore los bloques de contenido.
http://gemablog-.blogspot.com/2008/05/nuevos-elementos-en-el-header.html
- Para que el blog quede blanco desde el header al final en tu plantilla busca:

#outer-wrapper {
width: 970px;
margin:0 auto;
padding:10px;
text-align:left;
background:#FFFFFF;
font: normal bold 99% Trebuchet, Trebuchet MS, Arial, sans-serif;
}

Suerte ;)

Unknown

CONSEGUÍ ENTRAR, VIVA LA VIDA. LO QUE VOY A HACER ES REVISAR LA PLANTILLA A VER QUÉ PASA.$

Andres

Gem@! Que tal?

Siiiii! era eso!
Me quedo como lo pensaba!
Muchas gracias! No se que haria sin tu ayuda!
Saludos! :D

Unknown

hola gem@. te envío el link de lo que hice en http://paraninosconcabeza.blogspot.com en el footer, siguiendo las indicaciones rosa. quizás puedas "iluminarme" acerca de cuál es el problema, por que´é no se despliega el directorio el footer...
http://elescaparatederosa.blogspot.com/2009/05/expandir-y-contraer-gadget-con.html

Gem@

yz lk es que no puedo decirte más de lo que está explicado en esa entrada de Rosa, repasa los pasos que has dado guiandote por las explicaciones, comprueba que la palabra que añades donde Rosa pone "POPULARES" coincide con la que añades unas líneas más abajo (si te fijas Rosa las añade en color naranja para que destaquen)
Y donde Rosa dice b:widget id='HTML4' debes sustituir HTML4 por la id de tu gadget.

Unknown

ya lo embarré todo... ¿que es la id del gadget? si te refieres al título, así lo he hecho, pero no funciona. ¿tú no podrías mirar mi plantilla a ver que´obstaculiza que lo de rosa no me funcione. estoy SEGURA de hacer seguido los pasos correctamente.

luego recurrí a otra compañera que me dio unas instruccuiones bien distintas y mi plantilla es un caos. no sé cómo voy a areglarla. en la parte de directorios, al final de todo... http://paraninosconcabeza.blogspot.com. abrazos y besos...

Gem@

yz lk no se puede hacer una cosa siguiendo unos pasos y por tener un error seguir unas instrucciones distintas.
No quiero que pienses que me molesta porque te digo esto pero ahora mismo nos tienes contestando a tus preguntas a Rosa a J.Miur y a mi y a esa otra amiga que comentas. Es lógico que no lo soluciones porque no sigues un orden.
Te explico.. la id de gadget está en una línea más o menos así:
<b:widget id='HTML1' locked='false' title='' type='HTML'/>

Busca esa línea y a partir de ahí comprueba en la entrada de Rosa ese texto marcado en naranja que coinciden los dos nombres si en tu plantilla también tienes aunque distinto nombre pero en los dos sitios igual.
No puedo mirar la plantilla porque el PC me va muy lento y cada vez que intento acceder a una página se queda colgado.

Anónimo

¡que me estoy haciendo una plantilla yo solita que me doy el gusanillo cuando vi la nueva que has hecho y queria dividir el footer y de maravilla en cuanto la tenga terminada que pueden ser decadas je je eres la primera que la ve un saludote guapa :P

Gem@

yz ¡¡Que bueno Nafire !! tengo todo el tiempo del mundo, esperaré :D

Unknown

espero a que puedas ver mi plantilla. otra cosa no puedo haer. entiéndeme: el código de rosa lo puse bien, varias veces, y no fucniona por eso me desesperé y pedí ayuda a to el mundo. ahora solo me queda esperar que puedas ver lo que hay. no tengo otra...

Unknown

no es por nada , gem@, pero no sé por qué dices que cometí un error al aplicar los códigos de rosa. lo hice repetidas veces de la forma en que ella lo explica, porque su explicación es sencilla. he hecho contigo cosas más complicadas. pero si me dice que son scurpulus, effcets, etc., no sé de qué se me habla. PUEDE QUE EL PROBLEMA ESTÁ ALLÍ. te he enviado mi plantilla y el contendio de gadget para que cuando puedas lo mires. ahora la plantilla es un caos aunque rosa dice que ella no ve nada malo... pero hay una mezcolanza de códigos que es un espectáculo, y a pesar de eso puedo entrar a la página, que ya es algo. :P

Unknown

:$

Gem@

yz En ningún momento digo que cometieras un error aplicando el código de Rosa lk, lo que dije es que repasaras paso a paso por si habías cometido algún error es fácil que ocurra y nos pasa a todos.
Rosa tiene razón, el código está correcto en tu plantilla.
J.Miur te respondió diciendo que tenías scripts repetidos y siguen ahí eso son errores fácil de subsanarlos sólo hay que buscarlos y eliminar los que están sobrantes.
Estoy revisándola desde hace dos horas, hago lo que puedo lk no te creas que los errores salen en texto rojo, hay que probar eliminado los scripts uno a uno para ver si alguno interfiere.

Gem@

yz lk busca al principio de tu plantilla una línea que dice:
<script src='http://www.adweblink.com/rot.php?cod=4982'/>
Creo que es algún scripts relacionado con publicidad.
Eliminando ese script el efecto expandir ya funciona, también tienes errores el el gadget html de los directorios prueba a dejar en su interior cualquier código que esté correcto para ver el funcionamiento.

Gem@

yz ¿Viste la respuesta lk?

Unknown

saqué el script que me indicaste y no me funciona. no se despliega... voy a remandarte la plantilla.

Gem@

yz ¿I el gadget de los botones también lo sacaste?
eran las dos cosas las que estaban mal.

Unknown

hice todo eso y más. pero ya ves, lo único que consigo es [+/-]... triste

Gem@

yz No lo entiendo, tu plantilla en mi blog con esos cambios funcionaba perfectamente.
Sobre ese otro comentario de sustituir [+/-] por una imagen está explicado en la misma entrada al final.
Centrarlo no sé como podría hacerse.

Grandes Sabores Serv. de Banqueteria y Productora de Eventos

Hola Gem@ como has estado?

Yo que ahora ando con tiempo y estoy amonando un poquito el footer. Me preguntaba como habras escrito gema blog y plantilla minima de bloger en la parte inferior de tu plantilla (por si no me explique bien me refiero al que esta afuera del body en el fondo de la plantilla (parte de madera)).

Besos y espero que estes bien

Gem@

yz Grandes Sabores Banqueteria estoy muy bien, gracias :)
Sobre el tema de añadir datos "fuera del blog" mira la siguiente entrada:
http://gemablog-.blogspot.com/2009/04/footer-imagen-y-color.html

Isaac Chavero

Hola Gema,

me estoy haciendo un aficionado a tu blog que es de muchisima utilidad. Tengo un problema mi plantilla es la Sand Dollar un "poco modificada", ¡esta plantilla no tiene footer!, ¿como puedo habilitarlo? Al no tener footer no puedo añadir las tres columnas al final. Lo máximo que podría hacer seria arrastrar un gadget al final de las entradas.

Isaac Chavero

Prueba conseguida! era tan sencillo como copiar el codigo desde otra plantilla

Gem@

yz Eres una persona de recursos Isaac Chavero :)
Me alegra lo solucionaras.

Aldus

Hola Gema, hace rato que sigo tu blog, me gusta como desarrollas el tema, es bastante facil de entender, lo que cuesta es por ahi adaptarlo un poco dependiendo de la plantilla que tenga uno, logre poner widgets en el footer y te lo tengo que agradecer jeje. Gracias :) tambien quiero compartir mi site con vos, es un blogger al que le cambie la dirección del dominio, espero te guste...
www.fondosyfonditos.com.ar
Besos

Gem@

:: Saludos Aldus se agradece tu comentario, he vistado tu blog y veo un error en el bloque de la publicidad. El div inicial no está cerrado.

Aldus

Hola nuevamente Gem@, gracias por mirar mi site y ver ese error, no stoy seguro donde sta:((, vos me decis por los banner de dos columnas para públicidad que puse en la sidebar?, o por los del footer.
Besos www.fondosyfonditos.com.ar

Aldus

PD: He estado mirando los post de tu blog y vi uno que me llamo mucho la atención, el del blog wallpapers a full, extrañamente tiene el mismo nombre que mi blog, lo gracioso del tema es que su blog se llama como el mio, nada más que en el mio lo distinto es la dirección, más alla de eso no se quien creo primero el blog pero bueno, siempre y cuando podamos compartir yo no tengo drama... sin más otro saludo :)

Albert©
Este comentario ha sido eliminado por el autor.
Albert©

Hola Gema, se que puedes estar muy ocupada, pero me encantaria que me contestaras, aunque sea el comentario de la públicidad mal cerrada, lo de wallpapers a full, supongo que es un caso perdido, veo que tiene públicidad en tu site, así que no creo que quieras hablar mucho del tema, no hay problema.
Mis Saludos

Gem@

:: Lamento la demora Aldus no había visto los comentarios anteriores :(
El error que yo veía era un div mal cerrado de forma que dejaba parte del código visible en el gadget de la publicidad de 125x125.
Ahora he mirado de nuevo pero ese error ya no se ve, no sé si lo has solucionado o era algún problema al cargar la página.

No entiendo eso que el tema de los wallpapers sea un caso perdido, no sé que deseas decir ni por qué no voy a querer hablar de ese tema :O
Si te refieres al comentario 99 sobre la coincidencia del Título del blog no tengo ningún problema en darte mi opinión auque en realidad no me la pediste.
En la red hay muchisimas páginas de wallpapers, no hay ningún problema a la hora de escoger un nombre o título, ocurre también con cualquier página aunque no sea de wallpapers.
Lo que no verás es una página con tu misma url, son únicas, no puede haber dos urls iguales es algo así como el documento de identidad de la persona por poner un ejemplo.
Que una página sea creada antes o después que otra no da derecho alguno sobre el título, por otra parte en tu blog tienes en la configuración el título como Wallpapers a Full y en Google también aparece así sin embargo en el banner está como REVOLUTION.
Cuando alguien visite tu blog y quiera buscarlo en Google por cualquier motivo lógicamente lo hará con el título que ve en el banner.

Aldus

Tienes razón Gema, gracias por la aclaración, la verdad que lo del banner es algo que ando queriendo cambiar hace bastante, pero no me convence ninguno de los modelos que he creado, en algún momento veras que lo habre cambiado :D como tip personal te puedo decir que puse la públicidad de tu blog en uno de mis gadget de públicidad de 125x125 :P
Gracias por despejarme mis dudas.
Besos y estamos en contacto.

Gem@

:: Me alegra que si había alguna duda esté resuelta Aldus. Te agradezco el enlace, lo había visto pero olvidé comentarte sobre eso ;)

Anónimo

uff no me funcionó :(

creo q no se hacerlo, me salía error a cada rato
pero bueno, no importa, a los q les funcione bkn! :D

visiten mi blog http://es-tu-rock.blogspot.com :D

saludos!

Gem@

:: Es cosa de ver donde está el error Jimmy, alguna etiqueta mal cerrada por ejemplo.

Isaac Chavero

Hola de nuevo Gema,

después de añadir el footer manualmente porque mi plantilla no lo tenía, me encuentro con que el texto del contenido aparece subrayado ¿cómo puedo eliminar el subrayado?
el blog es www.larevistadecirugiaestetica.com

gracias por tu ayuda

Gem@

:: Saludos Isaac Chavero.
Busca en los estilos de la plantilla y donde veas:
text-decoration:underline;
sustitúyelo por text-decoration:none; ;)

Isaac Chavero

Hola Gema,

¡todos mis text-decoration estan "none"! pero sigue el subrayado

Gem@

:: Probemos a añadir una línea es las propiedades de los estilos en los enlaces, busca:
#outer-wrapper {
font:normal normal 105% Trebuchet, Trebuchet MS, Arial, sans-serif;
}
a {
color:#003366;
text-decoration:none;
}
a:hover {
color:#003366;
text-decoration:none;
}

y añade lo que está en negrita.

Si ves que con eso no desaparece intenta lo mismo en.
#col1{
text-decoration:none;
....
}

#col2{
text-decoration:none;
....
}

#col3{
text-decoration:none;
....
}
#col4{
text-decoration:none;
....
}

Isaac Chavero

¡Prueba conseguida! 1000 gracias

Ahora todo queda más limpio

Gem@

:: Mucho mejor así :)

PLAY IT LOUD!

Hola Gema:

Mira, tengo un gran problema con mi plantilla de blogger porque la he tratado de modificar para que tenga un diseño original. Se trata de algo raro en blogger y no sé como solucionarlo: quiero partir los post en dos partes: que a la izquierda quede el título y los datos de autor, fecha, tags y comentarios; y a la derecha el texto del post. Del estilo de como vienen en esta dirección, pero justo a la inversa (http://www.gerbster.nl/)
Manipulando los div de los artilugios he logrado ordenar más o menos todo pero al mover el post-body (texto de entrada) del post resulta que el texto del primer post me invade por abajo el del segundo. Es decir, que queda todo mal. ¿Me guías? Te dejo mi dirección en pruebas: http://playitloudblog.blogspot.com/
Espero que sea un reto para tí y te interese responderme. Eternamente agradecido...

Gem@

:: Saludos PLAY IT LOUD! ¿has porbado a añadir los post resumidos? puede que al mostrar un número determinado de caracteres se solucionara ese problema, te dejo el %% enlace

PLAY IT LOUD!

Hola Gema. Gracias por tu pronta respuesta. Sí, es algo que tenía pensado, pero no como lo planteas en ese post que me enlazas. Yo pensaba hacerlo con el típico "leer más" que ya tengo en otro blog, pero quizá esta solución sea mejor.
De todos modos algo debo de haber tocado en la plantilla para que me ocurra eso, y no me gusta mucho dejarla así, por si luego puede influir.
Se que el fallo ocurre cuando expando los artilugios y cambio de lugar el div del post-body colocándolo justo antes del h3 (título del post). Entonces es cuando me deja de respetar la separación entre post.
En fin, no te quiero molestar mucho, que tienes muchas peticiones. Probaré lo que dices.
Mil gracias, de verdad, por tu tiempo.

Gem@

:: No es molestia PLAY IT LOUD! yo creo que es la mejor opción porque de esa forma se ajusta en todas las entradas la misma altura.

Anónimo

amigo me ayudarias a poner un footer o lo que sea es que yo no tengo nose porke pero no me sale que puedo hacer?
gracias
PD :si quieres te mando la plantilla para que la veas

Gem@

:: Saludos Fackss, no puedo aceptar más plantillas en estos momentos porque estoy saturada de trabajo, pero no hay problema en ir guiándote para solucionar esas dudas.
Lo primero mira si tienes los códigos para empezar, por ejemplo <div id='footer-wrapper'>

Unknown

hola gem@, en http://wanttobuymywork.blogspot.com, ¿cómo puedo separar el widget izquierdo del margen? así como está queda muy pegadito al margen. zenkiu

Gem@

:: Yo creo que si añades los estilos para col1, col2 y col3 los contenidos adquieren ese margen.

Unknown

hola gem@ ¿a qué te refieres con añadir estilos? cuando cambio el margin no pasa nada...

Gem@

:: Me refiero a los estilos del contenedor, al final de la entrada dice como personalizarlos te falta esa parte :S

Unknown

gracias gem@, ayyy

Isaac Chavero

hola de nuevo gema. Despues de modificar el codigo y añadir 4 columnas en vez de tres. me encuentro que al hacer otras modificaciones como "numerar los comentarios" o añadir "pullquote" me desaparece el contenido de todos los elementos del footer. Tan solo aparece parcialmente al pasar el cursor por encima. No lo entiendo...¿a que puede ser debido? ¿cómo se puede solucionar?

Gem@

:: Isaac Chavero no veo ese efecto en tu blog ahora mismo, tendría que verlo para saber donde está el problema.

Isaac Chavero

Hola Gema, he descubierto que el defecto solo se ve en mi ordenador y solo cuando entro con mi cuenta de usuario. He creado un blog de pruebas y aparece el mismo defecto. Esta claro que el problema esta en mi ordenador o en exploradores (firefox e IE)

Gem@

:: Seguramente sea el navegador, yo he probado a mirar con Firefox y Explorer y no veo problema.
Actualiza el Explorer a la última versión, con Explorer8 se ve bien :)

Anónimo

hola gema gracias por todo solo una pregunta cuando pongo eso quisiera saber si se pudiera dejar sin espacios a los lados osea como el tuyo que se vea todo de un mismo color sin espacios a los lados...

no se si me entiedas pero podrias ver mi blog y ver q no todo el footer es del mismo color sino q le falta un poco para estarlo..

Gem@

:: descarga-tu-dvd intenta añadiendo en #footer en lugar de width: 960px; por ejemplo width:100%; en vista previa verás si resulta :)

Anónimo

se sigue viendo igual gema alguna otra opcion que sepas o tengas..??

Gem@

:: Puedes probar añadiendo color para que se vea si ocupa todo el ancho.
#footer {
background:#EEEEEE;
width: 100%;
clear: both;
margin: 0;
padding-top: 15px;
line-height: 1.6em;
text-transform: uppercase;
letter-spacing: .1em;
text-align: center;
}

Si con eso no se soluciona prueba añadiendo:

#footer-wrapper {
width: 960px;
background:#EEEEEE;
clear: both;
margin: 0 auto;
}

Anónimo

hahahaha ni con eso yo creo que a de ser por que en alguna parte o linea del codigo viene un margen o algo similar ya que agregando

#footer-wrapper {
width: 960px;
background:#EEEEEE;
clear: both;
margin: 0 auto;
}

se ve completo pero solo del lado izquierdo, gracias por ayudarme

Anónimo

ya pude solucionarlo lo que ise fue modificar esto

#outer-wrapper {
width: 940px;

se lo modifique a 960px y como se movio las entradas y la sidebar tambn modifique el

#main-wrapper y #sidebar-wrapper aqui solo agrege

padding: 0px 0px 0px 7px; para que las entradas se movieran un poco mas adentro de la plantilla y en la sidebar agrege padding: 12px 10px 0px 0px; para tambn meterlas un poco a la plantilla y bajarla para que quedaran al mismo nivel.

Gem@

:: Perfecto entonces :D

Eva Flores

Hola Gema, tengo una duda en cuanto al estilo del texto del footer. El caso es que me gustaría cambiarlo de color, pero no hay manera. Todo aparece con el color de los enlaces de la sidebar (y de todo el blog). Cuando aplico color: #ffffff en col1, col2 y col3, lo único que me cambia de color son los bullets. El texto mantiene el color de los enlaces.
¿Sabes que tendría que hacer para modificar el color del texto?
Muchas gracias de antemano y perdona las molestias.
Eva
Ma Petite Boulangerie

Gem@

:: Es que lo que tienes en el footer son widgets paara que cambie en color de esos widgwets debes crear una clase, por ejemplo si es "LOS QUE MÁS COMENTAN" buscas en la plantilla la id de ese widget que es id='HTML14' y antes de ]]> añades

#HTML14 li {
color:FFF !important;
}
Vemos si con eso cambia de color.

Eva Flores

Hola Gem@! Gracias por tu rápida respuesta. He probado lo que me has comentado y sigue sin cambiar de color...
Eva

Maite

Hola Gema, recuerdas que hice este footer para el blog personal de Julen? y quedó preciooooooso jejeje qué voy a decir yo! ya lo viste!
Ahora lo estoy haciendo en el nuevo de pruebas pero queda una separación enorme entre el cuerpo del blog y el footer, en teoría he repasado todos los códigos, consigo llevarlo más abajo incluso pero no pegarlo ni subirlo.
Estoy pensando que hay algo que entorpece a los márgenes que le intento dar, uno de ellos ha sido el famoso margin-top:-40px que siempre me ha funcionado en cabecera y cuerpo cuando los he intentado subir. Pero ni con esas.
Le he dicho incluso al outer-wrapper que se quite 40 de abajo y tampoco.
Te mando el enlace por email y me echas un vistazo porfa?
He probado con margin, con padding, con todo por si acaso, he comparado las dos plantillas y están supuestamente iguales... :O alucinando estoy... Besos (eso que no falte jejeje)

Gem@

:: Maite a outer-wrapper no le molestes en fin de semana se toma al pie de la letra eso de descansar ;)
Te he mando respuesta.

Maite

Gracias, eres un solete :D

Gem@

:: Y tu más :)

ofo1965

Hola Gema. Yo juraría que había insertado el mensaje esta mañana, pero mira, voy a repetirlo.
No localizo mi (div id='footer-wrapper'). Mi intención era dividir el footer en tres columnas y colorearlo o insertar una imagen. Me gusta tú footer, en seriooooo, sobre todo la nube de etiquetas.
Gracias de nuevo.

Gem@

:: ofo1965 en una plantilla de las que contiene footer puede encontrarse ese código al final del todo (SIN expandir la plantilla) justo antes de:

</div></div> <!-- end outer-wrapper -->
</body>
</html>

Puedes probar añadiendo justo ANTES:
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
Intenta con el vista previa porque aunque no veas ningún cambio eso nos dice si las etiquetas están bien cerradas o si por el contrario hay algún error.
Si no hay error guardas los cambios y prosigues con el siguiente paso de la entrada.

ofo1965

Hola Gema, he logrado instalar las tres columnas en el footer de mi blog, eso si, no se visualizan bien. También he provado insertar color e insertar foto de fondo y nada. En la actualidad hay una foto incrustada.:O
Gracias de nuevo.

Gem@

:: ofo1965 la imagen que tienes añadida así:
background:http://1.bp.blogspot.com/_c9i87ATLbUc/S2fwF4XEKfI/AAAAAAAAAWc/4cqSp71wvFA/s320/CIMG7746.JPG;

intenta ponerla así:
background-image:url('url-de-tu-imagen');

ofo1965

Ya he logrado insertar el color en el footer. Ahora, solo lo veo en el IExp. El texto me lo esta tapando un margen que venía con la plantilla. ¿Me podrias ayudar a localizar esos márgenes (Verdes) situados a la derecha y abajo?.

Gracias.

Gem@

:: Hola ofo1965 :)
Mira, busca donde dice:
#footer-wrapper {
clear:both;
display:block;
background:#FF8000;
height:1px;
margin:0px;
padding:0px;

font-size:15px;
line-height:2px;
}
elimina lo marcado en negrita y añade lo siguiente:
width:940px;
margin: 0 auto;

También puedes centrar el listado en
#ArchiveList { si en lugar de text-align:left ponemos text-align:center.

ofo1965

Hola Gema. Ya logro verlo bien en Mozilla y Google Chrome. El artilugio que me mencionas para centrar (ArchiveList { si en lugar de text-align:left ponemos text-align:center.) no lo encuentro, lo inserte debajo del footer-wrapper sin resultado. Ahora lo tengo antes de (]]>)Imagino que sirve para centrar mas el texto de cada columna del footer. La nube de etiquetas esta muy fea. Me gusta la tuya. Me la enrollas para llevar y me la prestas jajaja.
Gracias.

ofo1965

Perdona el icono contex.. no se que hace ahí. Bueno que se quede:O

Gem@

:: Vamos mejorando eh ofo1965?
Oye por qué no pruebas a cambiar provisionalmente el gadget central? me da la sensación que es muy ancho y empuja el contenido que hay a la izquierda.

Tengo dos nubes, en la sidebar está esta:
http://gemablog-.blogspot.com/2007/06/nube-de-etiquetas.html

Y en el footer esta:
http://gemablog-.blogspot.com/2009/05/nube-de-etiquetas-con-html.html

De todas formas la nube de etiquetas que proporciona Blogger puede personalizarse, no recuerdo ahora donde lo vi pero es posible hacerlo.

ofo1965

¿Mejorando?, en serio. Gracias a ti.

Gem@

:: A mi no, a tu perseverancia :)

ofo1965

Lo he logrado!!. Solo me falta centrar el footer. Eh probado varias formas y no me sale ehh!!

ofo1965

Creo que hay una imagen que molesta. Voy a ver si logro quitarla.

Gem@

:: Genial, por qué no intentas darle a footer-wrapper 930px en lugar de 940px quedaría más centrado.
Y de paso.. .donde añadiste
#ArchiveList {text-align:center;}
cambia a
#BlogArchive1_ArchiveList {text-align:center;}

ofo1965

Muchas gracias, almenos así queda mejor. Yo creia que el ancho del footer estaba ligado al de la página.

Gem@

:: A veces se añade el footer con ancho total, pero en tu caso hay un borde que rodea todo el contenido y la imagen superaba ese borde, estéticamente queda mejor que no se superponga sobre el borde al menos para mi gusto :)

Yeah! Positive

Hola gema, muy util el codigo. Una de las dudas que me queda es como modificar el alto de las columnas ya que me quedan un poco desproporcionadas.

Un Saludo.
www.yeahpositive.com.ar

Gem@

:: Eso no se puede controlar Yeah! Positive, ya que la altura dependerá de la misma altura que tenga el contenido. Al ser gadgets con distinta altura por lógica siempre tendrá la altura que corresponda al gadget más alto.

Anabel Cornago

Por fin lo he conseguido, jeje. Ahora falta cambiar un par de alturas, pero ya está.
Miles de gracias, corazón. Y muchos besotes.

Gem@

:: A qué alturas te refieres Anabel?

Anabel Cornago

Hola, Gema:
perdona que no te haya contestado antes. Maite se ha puesto las pilas para darle un aire primaveral a mi hierbita y entre código va y código viene, he estado como loca, jeje. Ya casi está, y me gusta mucho cómo está quedando el blog.

En cuanto a las alturas, verás: he puesto en el footer lo de plantilla Mínima y en los créditos vuestra gran ayuda (tú y maite). Me gustaría que no quedara tan abajo y todo en una línea (tu nombre se va a otra línea).

Si tienes un huequito, será genial que me ayudes.

Y ya puestos, me dice maite que me sale la barra de desplazamiento al final del blog, y que no debería. Yo ni me había fijado, jaja, ¡qué desastre!

Mil gracias, Danke y besotes, corazón.

Gem@

:: Hola Anabel :)
Lo de los créditos no era necesario que lo añadieras, el mérito es tuyo y de nadie más que eres la que ha trabajado sobre el blog, yo me limito a responder y unas veces funciona pero otras a lo mejor no tanto :)
Veras, yo creo que la línea del texto del footer queda partida porque cuando añadimos <p>al principio y </p> al final lo que hacemos es que lo añadido a continuación pase a la línea siguiente.
Si ese etiqueta inicial <p> la añades cuando comienza el enlace a Maite, pero la cierras cuando termina el mío se deberían mantener los dos en la misma línea. Es decir una sola etiqueta de apertura y otra de cierre que contenga los dos enlaces en su interior no sé si me explico :S
Es cierto lo que dice Maite de la barra de desplazamiento, prueba a quitar anchura a #footer-wrapper y en lugar de 980 de ancho déjalo en 950 que es la misma anchura que tiene #outer-wrapper de esa forma no aparecería a barra o por lo menos no debería ;)

Me olvidaba, la publicidad que tienes en la ventana emergente a la izquierda la añadiste o no sabes que la tienes ahí?

Anabel Cornago

¿Pero cómo no te voy a poner en los créditos?, he quitado la "p" y se ha ajustado la línea de inmediato.
En cambio, he modificado la anchura en el footer 950, pero la barra sigue estando ahí. snif.

¿Tengo publicidad? No, yo no la he puesto, ni tampoco la he visto nunca desde mi ordenador. ¿Cómo a podido ser? ¿Se puede quitar?

Besotes y gracias.

Gem@

:: Anabel vamos a intentar quitar esa publicidad y luego vemos lo de la barra porque a lo mejor el problema está ocasionado por esa publicidad.
Te mando una captura de como se ve cuando se accede a tu blog con Firefox, si no lo ves puede ser porque tengas activada la opción de "bloquear ventanas emergentes" %%esto es lo que se ve.
Ese tipo de publicidad camuflada normalmente la añaden en los códigos de widgets, mira algo relacionado con encuestas, chat no sé algo que tuvieras añadido y que el código te lo proporcionaran en alguna wrb desconocida ¿te suena esta dirección http://es.weborama.com/ ?
Cuando intentes localizar ese widget problemático y tengas duda lo que puedes hacer es quitar ese widget y guardar el código en el blog de notas así vas comprobando si la publicidad desaparece. Paciencia, estas cosas ocurren con más frecuencia de lo que piensas ;)

Anabel Cornago

Oh, sí, tengo lo de bloquear ventanas emergentes, ahora entiendo por qué mi ordenador me pitaba con frecuencia y me daba el mensaje -ni idea de lo que era claro, y -uf- lo he visto en tu captura y un horror-. En fin voy a investigar. Creo que los widget que he instalado eran:
- artículos relacionados -me lo cargué el otro día sin querer cambiando códigos.
- añadir a favoritos, que nunca ha funcionado.
- botón de envío directo a facebook -que he quitado hace unos días.
- marcadores sociales al pie de cada post.

Los dos que ya no están han sido por eliminación de los códigos en la sidebar, pero ¿están también en la plantilla? ¿y los otros widget también?
Siento ser tan desastre. Voy a ver si descubro la página donde los encontré -todo en la misma, por cierto-. No me suena la que dices, pero quién sabe.
Gracias por la paciencia y muchos besotes.

Anabel Cornago

Hola de nuevo, corazón:
he encontrado la página donde cogí los widget, y parece de total confianza y profesional (te lo puedo mandar en un mail, pues no me parece bien dejar el nombre aquí).
Los de la sidebar están todos eliminados (eran enlace a facebook y artículos relacionados); lo de añadir a favoritos no puedo, pues maite me lo juntó todo con otros iconos -libro de visitas, feeds, etc-.
El de marcadores sociales lo he eliminado de la plantilla.

Ya no sé qué más hacer; ojalá así se haya solucionado, pero creo que no.

¡Feliz día!

Gem@

:: Anabel la primera vez que he mirado si aparecía luego he probado otra vez y ya no sale no sé si porque has conseguido quitarla o lleva alguna clase de script que hace que sólo se visualice la primera vez que accedes.
Mañana compruebo si sigue apareciendo y si es así te aviso que me mandes la plantilla por si viera algo extraño ¿ok?

Anabel Cornago

Muchas gracias, Gema.
Espero tus noticias, ¡qué bien!

besotes.

Anabel Cornago

Hola de nuevo:
soy una pesada, lo siento. Acabo de mandarte un correo; creo que he podido descubrir de dónde venía esa publicidad: de un fondo gratuito instalado en el blog de pruebas y tomado de una página que he visto está esponsorizada por "chats y contactos".
¿podría ser?, la publi es la misma que la de esos contactos.
Besotes.

Gem@

:: No digas eso de pesada Anabel :S me temo mucho que no dio resultado, te respondí a ese mail :D

Anabel Cornago

Ay, corazón, muchísimas gracias para ti y para JMiur por haberme quitado ese pegote publicitario.

Besotes enormes :)

Gem@

:: Nunca mejor dicho lo de pegote Anabel, y pensar que algunos lo tendrán y no lo saben :S
Me alegra estés contenta :)

Dr. Page

Hola Gema. Buenas noches, trate de hacerlo pero no me quedan al mismo nivel.

Gem@

:: Muy buenas Dr. Victor Guillermo .
Ese problema se puede solucionar añadiendo más espacio en la parte superior referente al contendedor central, puede probar en #col2 con margin:30px 0; y vemos si se soluciona.

Dr. Page

Hola Gema muchas gracias por la ayuda, resulto pero ahora bajo la ultima, además quedan muy pegados gadget uno de otros como pudiera solucionarlo, gracias y disculpa tanta molestia con mi ignorancia.

Gem@

:: Ese problema se puede solucionar aumentando el padding de cada bloque, un ejemplo:
#col1{
background:#fff;
margin: 5px;
padding: 19px;
border: 1px solid #fff;
}

Paolo Blanco

Que tal Gemma, antes que nada gracias por la ayuda que siempre nos das, de verdad es una gran labor la que realizas.

Gemma esta es mi inquietud, aplique lo que indicaste en esta entrada, y me quedo genial, pero tengo un problema con los enlaces.

Cuando entras al blog (b-deblog.blogspot.com) podrás darte cuenta que en el Sidebar los "Enlaces" aparecen en Negro, en la Parte que dice "Enlace de Prueba 1" pero si se compará con el que se encuentra en la tercera columna del footer "enlace de prueba 2" podrás apreciar que los enlaces no pueden verse, dado a que siguen en fuente negra sobre fondo igualmente negro.

Mi pregunta, Gema, es ¿Cómo puedo configurar los links de las columnas del footer? es decir colocarle por ejemplo un color blanco para que se distingan, no solo de las listas de enlaces, sino que en cualquier enlace que se encuentre en el footer.

De antemano mil gracias por tu respuesta Gemma.

Gem@

:: Pues no consigo acceder a esa url The Marco pero si deseas un color distinto para esos enlaces del footer puedes añadir algo así:
#footer-columna-contenedor a {color: #fff; }
Con eso haces que todos los enlaces del footer sean de color blanco.

necrofobicadeclarada

No encuentro por ningun lado esto -> ]]>

Gem@

:: Pues está justo después de los estilos de la plantilla :S

Anónimo

Orale gema me sirvio mucho mira mi web www.symdc.blogspot.com

Gem@

:: Estupendo C@r/os, ha quedado estupendo :)

Anónimo

:( Gema ayudame no encuntro un fondo a mi footer me podrias acesorar si porfis

Gem@

:: C@r/os no he entendido bien si te refieres a que no encuentras un fondo acorde con tu blog o que ya lo tienes y no se ve :S

Anónimo

jeje al fin era que el codigo del fondo de footer se me habia borrado solucionado sabes gema tu blog a sido de mucha ayuda si miras mi blog veraz que gracias a tus consejos a podido cambiar :$

Gem@

:: Perfecto entonces, gracias por el comentario C@r/os :)

mdlm

Solo agradecer por la información, con la entrada anterior no podía hacer nada, hasta que en los comentarios vi el link y solo faltaba "#col1{
background:#000;..." la otra parte lo vi en otro blogger :$, en fin gracias :D. http://mixdelasmejoresbaladas.blogspot.com/

FILÁ NOSOTRAS

hola Gem@ estoy haciendo las explicaciones tuyas para poner foto en el Footer, pero mno me sale podrias mirar mi plantilla,http://www.blogger.com/html?blogID=22359201 para ver que estoy haciendo mal. gracias

Gem@

:: FILÁ NOSOTRAS no entiendo bien lo que deseas poner el el footer ¿una foto? ¿pero dónde como fondo o un gadget?
Esa url que me has dejado no lleva a ninguna parte es la id de tu blog :D

FILÁ NOSOTRAS

es que soy un poco borrica,http://lomasnueve.blogspot.com/
lo que yo quiero poner es una foto en el fondo en el footer.
menos mal que te hice caso y guarde la plantilla, la he tenido que utilizar. un abrazo

Gem@

:: FILÁ NOSOTRAS yo creo qu elo que deseas hacer es lo siguiente:
http://gemablog-.blogspot.com/2009/04/footer-imagen-y-color.html

A no ser qu eyo esté confundida y deseas añadir la explicación de esta entrada sobre columnas en el footer, en ese caso lo primero que debes hacer es añadir las columnas y por último la imagen de fondo.

Gem@

:: Me alegra esté resuelto Egam :)

María Lozano Correa

Hola Gema, tenía una pregunta que hacerte... se puede dividir el footer en vez de en 3 columnas en 4?? esque al poner 'float:left' right, y centre, si son 4 que se pondría?? muchas gracias por adelantado, tu blog está genial!!
María

Smokedark

hola Gem@ bueno me quedo todo bien pero quisiera que se esturara mas el anchor de todo por que queda espacios en los lados y abajo si no checa mi sitio para que veas como me quedo y estirar el anchor en total...
www.v-junker.com

Unknown

hola gema@! mira en http://pparaninosconcabeza.blogspot.com. yo quería poner un footer fondo rojo con letras en beige sin las separaciones entre gadgets y de una altura de unos 250px. pero mira lo que me ha salido. ¿qué pasos me he saltado? zenkiuuuu

FILÁ NOSOTRAS

Hola Gem@he puesto este articulo en mi blog, ¡eres unica!pero tengo un problema en el foter de la izquierda y en el del centro sale otro color y no quiero ninguno, mi blog es http://lomasnueve.blospot.com.
ademas te voy a contar otro problema, una vez puse un menu luego lo quite y me ha quedado una franja negra en la cabecera ¿podrias decirme como puedo quitar la franja? gracias amiga

Gem@

:: No veo el blog FILÁ NOSOTRAS, es como si el servidor estuviera caído o problemas con el dominio :S

FILÁ NOSOTRAS

Gem@ cuando puedas lo miras yo hoy he entrado sin problemas es una linea gris que esta en el footer, gracias

Gem@

:: Pues yo sigo sin verlo :S

Los comentarios han sido inhabilitados temporalmente. ¡GRACIAS!

:):'(:(:P:D:$;):-I:X:O|O:S

Nota: solo los miembros de este blog pueden publicar comentarios.

 


top